<html>

	<head>
		<meta charset="utf-8" />
		<title></title>
	    <script>
	    	if(localStorage.getItem("language") == "zh_cn"){
	    		document.write("<script type='text/javascript' src='js/zh_cn.js'><\/script>");
	    	}else if(localStorage.getItem("language") == "zh_tw"){
	    		document.write("<script type='text/javascript' src='js/zh_tw.js'><\/script>");
	    	}else{
	    		document.write("<script type='text/javascript' src='js/en.js'><\/script>");
	    	}
	    </script>
		<script type="text/javascript" src="js/jquery-2.1.0.js" ></script>
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<style type="text/css">
			body {
				margin: 0;
				padding: 0;
			}
			.d1,.d2,.d3,.d4{
				width: 178px;
				height: 22px;
				bottom: 11.5%;		
				text-align: center;		
				position: absolute;
				transition: height 1s;
				cursor: pointer;
			}
			.d1{
				left:18.7%;	
				height: 300px;			
				background: #7cb5ec;
			}
			.d2{
				left:37.7%;
				height: 220px;		
				background: #8085e9;
			}
			.d3{
				left:56.7%;
				height: 190px;		
				background: #90ed7d;
			}
			.d4{
				left:75.7%;
				height: 320px;		
				background: #f7a35c;
			}
			span{
				color: #000;;
			}
		</style>
	</head>

	<body>
		<div class="page-header">
				<h2><script>document.write(language.Control_panel)</script></h2>
			</div>
		<!--<div id="container" style="width: 80%; height: 800px; margin: 0 auto"></div>-->
	
			<div class="d1"><span class="s1"><script>document.write(language.Current_visitors)</script>30<script>document.write(language.people)</script></span></div>
			<div class="d2"><span class="s2"><script>document.write(language.Current_visitors)</script>22<script>document.write(language.people)</script></span></div>
			<div class="d3"><span class="s3"><script>document.write(language.Current_online_contractors)</script>19<script>document.write(language.individual)</script></span></div>
			<div class="d4"><span class="s4"><script>document.write(language.Current_borrowed_goods)</script>32<script>document.write(language.individual)</script></span></div>
	
		<script language="JavaScript">
			$(document).ready(function() {				
				setInterval(function(){
					var x=Math.floor(Math.random()*350+100);
					var x0=Math.floor(Math.random()*350+100);
					var x1=Math.floor(Math.random()*350+100);
					var x2=Math.floor(Math.random()*350+100);
					$('.s1').text(language.Current_visitors+parseInt(x*0.1)+language.people);
					$('.s2').text(language.Current_online_contractors+parseInt(x0*0.1)+language.people);
					$('.s3').text(language.Current_projects_under_construction+parseInt(x1*0.1)+language.individual);
					$('.s4').text(language.Current_borrowed_goods+parseInt(x2*0.1)+language.individual);
					$(".d1").height(x);
					$(".d2").height(x0);
					$(".d3").height(x1);
					$(".d4").height(x2);
				},2000);			
			});
			
			$('.d1').click(function(){
				window.location='kongzhi_yiban.html';
			})
			$('.d4').click(function(){
				window.location='kongzhi_jie.html';
			})
			$('.d3').click(function(){
				window.location='kongzhi_gongcheng.html';
			})
			$('.d2').click(function(){
				window.location='kongzhi_cheng.html';
			})
			
		</script>
		
	</body>

</html>